<template>
  <div class="addContract">
    <public-header></public-header>
    <notice></notice>
    <div>
      <van-cell-group style="text-align:left">
        <van-field
          label-class="fw"
          name="用户名"
          v-model="form.fusername"
          label="用户名:"
          v-validate="'required'"
          data-vv-scope="registerForm"
          :error="errors.has('registerForm.用户名')"
          :error-message="errors.first('registerForm.用户名')"
          required
          placeholder="请输入用户名"
        />
      </van-cell-group>
    </div>
    <div style="margin-top:100px">
        <qrcode ref='qrcodeRef'></qrcode>
    </div>
    
    <div class="IIFooterBtn" v-if="fappstatusid">
      <div class="byprojectV2">
        <div class="byprojectBtnV2" @click="examine">审核</div>
      </div>
    </div>
    <div class="IIFooterBtn" v-if="showSubmit">
      <div class="bystandardNo">
        <div class="bystandardBtn" @click="submit">保存</div>
      </div>
    </div>
    <van-dialog
      v-model="showexamine"
      title="审核"
      show-cancel-button
      confirm-button-text="通过"
      cancel-button-text="驳回"
      @confirm="pass"
      :closeOnClickOverlay="true"
      @cancel="noPass"
    >审核或者驳回？</van-dialog>
  </div>
</template>

<script>
import notice from "@/components/notice";
import qrcode from "@/components/qrcode";
import { getData } from "@/api/gov/logon";
import { registerPersonGov, approvedPersonGov } from "@/api/gov/normalLogon";
import {
  Field,
  DatetimePicker,
  Popup,
  Cell,
  CellGroup,
  Picker,
  Area,
  Dialog,
  Toast
} from "vant";
import publicHeader from "@/components/publicHeader";
export default {
    name: "addContract",
    components: {
        notice,
        qrcode,
        publicHeader,
        [Toast.name]: Toast,
        [Area.name]: Area,
        [Cell.name]: Cell,
        [CellGroup.name]: CellGroup,
        [Field.name]: Field,
        [DatetimePicker.name]: DatetimePicker,
        [Popup.name]: Popup,
        [Picker.name]: Picker,
        [Dialog.Component.name]: Dialog.Component
    },
    created() {
        this.$nextTick(() => {
            this.$refs.qrcodeRef.qrcode('https://www.baidu.com')
        })
        if (this.$route.query.fappstatusid) {
            this.fappstatusid = this.$route.query.fappstatusid;
        }
        if (this.$route.query.fid) {
            this.showSubmit = false;
            this.examineForm.fuserid = this.$route.query.fid;
            getData({
                ffunctionid: this.$route.query.ffunctionid,
                fid: this.$route.query.fid
            }).then(res => {
                console.log(res);
                if (res.isSuccess) {
                    if (res.list.length != 0) {
                        this.form.fusername = res.list[0].fusername;
                    }
                }
            });
        } else {
            this.showSubmit = true;
        }
    },
    data() {
        return {
            fappstatusid:'',
            showSubmit: false,
            showexamine: false,
            examineForm: {
                fstate: "",
                ffunctionid: "managercrud",
                fappstatusid: "managercrud_approved",
                fuserid: ""
            },
            form: {
                ffunctionid: "managercrud",
                fappstatusid: "managercrud_register_person",
                fusername: "",
                fopenid: "ainiaini",
                fbusinessid: "3647a16c-87c2-43f1-a3d0-60991543216c",
                fadmincode: "111",
                furl: window.location.href
            }
        };
    },
    methods: {
        examine() {
            this.showexamine = true;
        },
        pass() {
            this.examineForm.fstate = 1;
            approvedPersonGov(this.examineForm).then(res => {
                if (res.isSuccess) {
                    Toast.success("通过成功");
                    this.showexamine = false;
                    this.$router.go("-1");
                }
            });
        },
        noPass() {
            this.examineForm.fstate = 0;
            approvedPersonGov(this.examineForm).then(res => {
                if (res.isSuccess) {
                    Toast.success("驳回成功");
                    this.showexamine = false;
                    this.$router.go("-1");
                }
            });
        },
        submit() {
            this.$validator.validateAll("registerForm").then(valid => {
                if (valid) {
                registerPersonGov(this.form).then(res => {
                    if (res.isSuccess) {
                        Toast.success("注册成功！");
                    } else {
                        Toast.fail(res.errMessage);
                    }
                });
                }
            });
        }
    }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style>
.bystandard {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50%;
}

.byprojectV2 {
  width: 70%;
  margin: 0 auto;
}
.bystandardNo {
  margin: 0 auto;
  width: 70%;
}
.byprojectBtnV2 {
  font-size: 14px;
  background: #07c160;
  width: 70%;
  margin: 0 auto;
  height: 30px;
  line-height: 30px;
  border-radius: 50px;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
}
.bystandardBtn {
  font-size: 14px;
  background: #ff976a;
  margin: 0 auto;
  width: 70%;
  height: 30px;
  line-height: 30px;
  border-radius: 50px;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
}
.bystandardBtn {
  font-size: 14px;
  background: #ff976a;
  width: 70%;
  height: 30px;
  line-height: 30px;
  border-radius: 50px;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
}
.IIFooterBtn {
  width: 100%;
  height: 40px;
  line-height: 40px;
  position: fixed;
  bottom: 0;
  left: 0;
  color: white;
  display: flex;
}
.govBottom {
  width: 100%;
  height: 40px;
  position: fixed;
  bottom: 0;
  left: 0;
  background: #07c160;
  text-align: center;
  line-height: 40px;
  color: white;
}
.faddContractFooter {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 40px;
  display: flex;
  flex: 1;
}
.leftBtn4addContract {
  line-height: 40px;
  width: 100%;
  text-align: center;
  background-color: #07c160;
  color: white;
}
.rightBtn4addContract {
  line-height: 40px;
  width: 50%;
  text-align: center;
  background-color: #1989fa;
  color: white;
}
.inputs {
  display: flex;
  justify-content: space-around;
  width: 90%;
  margin: 0 auto;
}
.inputs input {
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #999;
  text-align: center;
  font-size: 20px;
}

.fw {
  font-weight: 700;
}
</style>
